<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE HTML>
<html>
<head>
    <title>欢迎注册EasyMall</title>
    <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/regist.css"/>
    <script type="application/javascript" src="<%=request.getContextPath()%>/js/jquery-1.4.2.js"></script>
    <script type="application/javascript">


    function setMsg(id,msg) {
            document.getElementById(id+"_msg").innerText=msg;
        }

        function checkNull(name,msg) {
            setMsg(name,"")
            var v=document.getElementsByName(name)[0].value;
            if(v == null || v==""){
                setMsg(name,msg)
                return false;
            }
            return true;
        }

        function checkForm() {
            //用户名不能为空的校验
            /* var username=document.getElementsByName("username")[0].value;
             if(username == null || username == ""){
                 //alert("用户名不能为空")
                 //document.getElementById("username_msg").innerText="用户名不能为空!"
                 setMsg("username","用户名不能为空")
             }

             var password=document.getElementsByName("password")[0].value;
             if(password == null || password == ""){
                 setMsg("password","密码不能为空")
             }*/
            var canSub=true;
            canSub=checkNull("username","用户名不能为空") && canSub;
            canSub=checkNull("password","密码不能为空")&& canSub;
            canSub=checkNull("password2","确认密码不能为空")&& canSub;
            canSub=checkNull("nickname","昵称不能为空")&& canSub;
            canSub=checkNull("email","邮箱不能为空")&& canSub;
            canSub=checkNull("valistr","验证码不能为空")&& canSub;

            //两次密码一致校验
            var pwd=document.getElementsByName("password")[0].value;
            var pwd2=document.getElementsByName("password2")[0].value;
            if(pwd!=null && pwd!=""&&pwd2!=null&&pwd2!=""&&pwd!=pwd2){
                setMsg("password2","两次密码不一致")
                canSub=false;
            }
            //邮箱校验
            var email=document.getElementsByName("email")[0].value;
            if(email !=null && email !="" &&!/^\w+@\w+(\.\w+)+$/.test(email)){
                setMsg("email","邮箱格式不正确")
                canSub=false;
            }
            return canSub;
        }

        function checkPassword2() {
            setMsg("password2","")
            var pwd=document.getElementsByName("password")[0].value;
            var pwd2=document.getElementsByName("password2")[0].value;
            if(pwd2==null || pwd2==""){
                setMsg("password2","确认密码不能为空")
                return;
            }
            if(pwd!=null && pwd!=""&&pwd2!=null&&pwd2!=""&&pwd!=pwd2){
                setMsg("password2","两次密码不一致")
            }
        }
        function changeImg(imgObj) {
            imgObj.src="<%=request.getContextPath()%>/servlet/VerifyCodeServlet?time="+new Date().getTime();

        }

        function checkName(){
        //检查是否为空
            var isNotNull=checkNull('username','用户名不能为空');
            //不为空的时候校验
            if (isNotNull){
                var username=document.getElementsByName("username")[0].value;
                //AJAX异步检查用户名是否存在
                $.get("<%=request.getContextPath()%>/Servlet/AjaxHasUsernameServlet",{"username":username},function (data){
                    alert(data);
                })
            }
        }

    </script>
</head>
<body>
<h1>欢迎注册EasyMall</h1>

<form action="servlet/RegistServlet" method="POST" onsubmit="return checkForm()">
    <table>
        <tr>
            <td colspan="2" style="color: red;text-align: center">
                <%=request.getAttribute("msg")==null ? "":request.getAttribute("msg")%>
            </td>
        </tr>
        <tr>
            <td class="tds">用户名：</td>
            <td>
                <input type="text" name="username" value="<%=request.getParameter("username")==null?"":request.getParameter("username")%>" onblur="checkUsername()">
                <span style="color: red" id="username_msg"></span>
            </td>
        </tr>
        <tr>
            <td class="tds">密码：</td>
            <td>
                <input type="password" name="password" onblur="checkNull('password','密码不能为空')">
                <span style="color: red" id="password_msg"></span>
            </td>
        </tr>
        <tr>
            <td class="tds">确认密码：</td>
            <td>
                <input type="password" name="password2" onblur="checkPassword2()">
                <span style="color: red" id="password2_msg"></span>
            </td>
        </tr>
        <tr>
            <td class="tds">昵称：</td>
            <td><input type="text" name="nickname" onblur="checkNull('nickname','昵称不能为空')">
                <span style="color: red" id="nickname_msg"></span>
            </td>
        </tr>
        <tr>
            <td class="tds">邮箱：</td>
            <td><input type="text" name="email" onblur="checkNull('email','邮箱不能为空')">
                <span style="color: red" id="email_msg"></span>
            </td>
        </tr>

        <tr>
            <td colspan="2">
                <input type="submit" value="注册用户"/>
            </td>
        </tr>
    </table>
</form>
</body>
</html>

